import presetWeapp from 'unocss-preset-weapp'
import { defineConfig, presetIcons } from 'unocss'
import { transformerAttributify, transformerClass } from 'unocss-preset-weapp/transformer'

// css属性文档可参考 https://windicss.org/utilities/general/colors.html
export default defineConfig({
  rules: [
    [/^wh-(.*)$/, ([, d]) => ({ width: `${d}rpx`, height: `${d}rpx` })],
    [/^safe-h-(.*)$/, ([, d]) => ({ height: `calc(env(safe-area-inset-bottom) + ${d}rpx)` })],
    [/^safe-pb-(.*)$/, ([, d]) => ({ 'padding-bottom': `calc(env(safe-area-inset-bottom) + ${d}rpx)` })],
  ],
  shortcuts: [
    {
      'wh-full': 'w-full h-full',
      'bottom-fix': 'fixed bottom-0 left-0 w-100vw',

      'input-wrap': 'bg-#F5F6F8 rounded-16rpx p-x-24rpx p-y-20rpx',
      'card-wrap': 'bg-white m-x-32rpx p-24rpx rounded-24rpx',

      'flex-row-center': 'flex justify-center items-center',
      'flex-col-center': 'flex flex-col justify-center items-center',
      'flex-row-between': 'flex justify-between items-center',
      'flex-col-between': 'flex flex-col justify-between',
      'flex-x-center': 'flex justify-center',
      'flex-y-center': 'flex items-center',

      'transition-base': 'transition-all duration-300 ease-in-out',

      'absolute-center': 'absolute transform top-50% left-50% translate-y--50% translate-x--50%',
      'absolute-x-center': 'absolute transform left-50% translate-x--50%',
      'absolute-y-center': 'absolute transform top-50% translate-y--50%',

      'btn-base': 'flex-row-center rounded-16rpx text-#333 bg-#F5F6F8',
      'primary-btn': 'btn-base bg-primary text-white',
      'primary-secondary-btn': 'btn-base text-primary b-2 b-solid b-primary text-primary bg-transparent',
      'primary-gradient-btn': 'btn-base from-primary to-light-primary bg-gradient-to-r text-white',
      'no-click-gradient-btn': 'btn-base from-#AAAAAA to-#CCCCCC bg-gradient-to-r text-white',
    },
  ],
  theme: {
    colors: {
      // 主色
      primary: '#1888FF',
      // 主色亮一点
      lightPrimary: '#73B7FF',
      // 默认暗色
      lightGray: '#AAAAAA',
      // 默认黑色
      defaultBlack: '#333333',
    },
  },
  presets: [
    presetWeapp({
      // h5兼容
      platform: 'uniapp',
      isH5: process.env.UNI_PLATFORM === 'h5',
    }),
    presetIcons({
      scale: 1.2,
      warn: true,
    }),
  ],
  transformers: [
    transformerAttributify(),
    transformerClass(),
  ],
})